<template>
  <div id="app">
    {{fullName}} / {{msg}}
    <button @click="add(`❤`)">add ❤</button>
    <!--<button @click="addByM(`☆`)">add ☆</button>-->
  </div>
</template>

<script>
  // export  default  {Store(){}}
  // export function mapState(){}
  // export function mapGetters(){}
  // import vuex from "vuex"
  // import {mapState,mapGetters} from "vuex"

  import {mapState,mapGetters,mapActions} from "vuex"
  export default {
    name: 'App',
    computed:{
      ...mapGetters(["fullName"]),
      ...mapState(["msg"])
    },
    methods:{
      ...mapActions(["add"]),
    }
  }
</script>

<style scoped>
  .count{
    display: block;
    width: 100px;
    height: 100px;
    background: pink;
    border-radius: 50%;
    text-align: center;
    line-height: 100px;
    font-size: 30px;
  }
</style>
